body {
	height: 100%;
	width: 100%;
	background-color: #f3f3f3;
	/* 必须设置内边距外边距为0，要不然主体会和周围有白缝 */
	margin: 0;
	padding: 0;
}
/****** 头部部分 ******/
.header-wrapper {
	width: 100%;
	height: 12vw;
	background-color: #ffcf00;
}
.header {
	width: 100%;
	height: 12vw;
	position: fixed;
	font-size: 4vw;
	font-weight: bold;
	background-color: #ffcf00;

	display: flex;
	justify-content: space-between;
	align-items: center;
}
.header i {
	margin-right: 3vw;
}

/****** 主体内容部分 ******/
.main {
	width: 100%;
	background: linear-gradient(#ffcf00, #f3f3f3);
}
	/*主体内容文字部分*/
.font-part {
	margin-left: 3vw;
	padding-top: 2vw;
	margin-bottom: 3vw;
	font-size: 4.5vw;
	font-weight: bold;
}
.font-part :first-child {
	font-size: 6.5vw;
	color: red;
}
.font-part :last-child {
	font-size: 3vw;
}
	/*主体内容卡片部分*/
.card-part-wrapper {
	width: 100%;
	margin-bottom: 4vw;
	display: flex;
	justify-content: center;
	align-items: center;
}
.card-part-wrapper .card-part {
	width: 90%;
	background-color: white;
	border-radius: 2vw;
	padding: 3vw 2vw;
}
		/*可用范围点击后样式*/
.userange {
	width: 75vw;
	padding: 3vw;
	font-size: 3.7vw;
	position: fixed;
	color: white;
	opacity: 0;
	border-radius: 2vw;

	background-color: rgba(0, 0, 0);

	left: 10vw;
	top: 75vw;
}

		/*卡片的第一部分*/
.card-part-wrapper .card-part .module1 {
	display: flex;
	justify-content: space-between;
}
.card-part-wrapper .card-part .module1 :first-child {
	font-size: 3.4vw;
	letter-spacing: 3px;
	font-weight: bold;
}
.card-part-wrapper .card-part .module1 :first-child span {
	color: red;
}
.card-part-wrapper .card-part .module1 .lastchild {
	color: #7c7c7c;
	font-size: 2.7vw;
}
.card-part-wrapper .card-part .module1 :last-child i {
	margin-left: 6px;
}
		/*卡片第二部分*/
.card-part-wrapper .card-part .module2 {
	width: 100%;

	display: flex;
	justify-content: center;
	align-items: center;
}
.card-part-wrapper .card-part .module2 img {
	width: 100%;
	height: 100%;
	border-radius: 2vw;
	margin: 3vw 0;
}
		/*卡片第三部分*/
.card-part-wrapper .card-part .module3 {
	font-size: 3.4vw;
	letter-spacing: 3px;
	font-weight: bold;
}
		/*卡片第四部分*/
.card-part-wrapper .card-part .module4 {
	width: 100%;
	margin-top: -2vw;
	margin-bottom: 6vw;
	display: flex;
	flex-wrap: wrap;
}
.card-part-wrapper .card-part .module4 div {
	width: 25%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.card-part-wrapper .card-part .module4 img {
	width: 70%;
	margin-top: 4vw;
}
.card-part-wrapper .card-part .module4 p {
	font-size: 3.2vw;
	font-weight: bold;
	margin: 0.25vw 0;
}
.card-part-wrapper .card-part .module4 span {
	font-size: 3vw;
	color: #7c7c7c;
}
		/*卡片第五部分*/
.card-part-wrapper .card-part .module5-wrapper { /*让该按钮可以居中*/
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.card-part-wrapper .card-part .module5 {
	width: 90%;
	height: 11vw;
	background: repeating-linear-gradient(to right, #ffcf00, red, #ffcf00);/*渐变色效果*/
	color: white;
	font-size: 6vw;
	font-weight: bold;
	border-radius: 2.5vw;

	display: flex;
	justify-content: center;
	align-items: center;
}
.card-part-wrapper .card-part .module5 :first-child {
	font-size: 3vw;
}
.card-part-wrapper .card-part .module5 :last-child {
	font-size: 5vw;
}
		/*卡片第六部分*/
.card-part-wrapper .card-part .module6 {
	width: 100%;
	font-size: 2.8vw;
	color: #7c7c7c;
	border-bottom: 1px solid #7c7c7c;
	display: flex;
	justify-content: center;
	align-items: center;
}
		/*卡片第七部分*/
.card-part-wrapper .card-part .module7 {
	width: 100%;
	font-size: 2.8vw;
	color: #7c7c7c;
	display: flex;
	justify-content: center;
	align-items: center;
}
.card-part-wrapper .card-part .module7 span {
	color: red;
}
.card-part-wrapper .card-part .module7 i {
	margin-left: 0.75vw;
}

/****** 底部菜单栏部分 *******/
.footer-wrapper {
	width: 100%;
	height: 14vw;
}
.footer {
	width: 100%;
	height: 14vw;
	border-top: 1px solid #eeeeee;
	background-color: white;

	position: fixed;
	left: 0;
	bottom: 0;

	display: flex;
	justify-content: space-around;
	align-items: center;
}
.footer div {
	width: 25%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.footer div i {
	border: 1px solid;
	padding: 1vw;
	border-radius: 5vw;
	color: #fafad2;
	background-color: #ffcf00;
}
.footer div span {
	font-size: 3vw;
}